<script  lang="ts">
import * as iconUtils from "@/utils/IconUtils"
import {h} from "vue"
import {notification} from "ant-design-vue";
    export default {
      props:{
        iconName:{type:String},
        noteFlag:{type:Boolean}
      },
      setup(props,{emit}) {
        // 返回渲染函数
        // return () => h(iconUtils.getIcon(props.iconName));
        // return () => h('span',[h(iconUtils.getIcon(props.iconName)),h('div',props.iconName)]);
        return () => h('div',{class:'cursor-pointer text-center',
          onClick:()=>{
            emit("changed",props.iconName);
            if(props.noteFlag){
              try {
                console.log("开始复制到剪切板",props.iconName);
                navigator.clipboard.writeText(props.iconName);
                notification.success({
                  message: "复制成功",
                  description:  props.iconName
                });
              } catch (err) {
                console.error('复制失败',props.iconName, err);
              }
            }
          }}, [
              h(iconUtils.getIcon(props.iconName),{class:'icon'}),
          h('div',{class:'title'},props.iconName)
        ]);
      }
    }
</script>
<style scoped>
.icon{
  font-size: 36px;
}
.title{
  font-size: 10px;
}
</style>
